<template>
  <div>
    <a-form-model
      :model="model"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
      :rules="validatorRules"
      v-if="enterpriseStatus"
      ref="form"
    >
      <a-row>
        <a-col :span="24">
          <a-form-model-item label="营业执照" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="businessLicense">
            <j-upload v-model="model.businessLicense"></j-upload>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item
            label="组织机构代码证"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            prop="organizationCodeCertificate"
          >
            <j-upload v-model="model.organizationCodeCertificate"></j-upload>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item
            label="法人身份证"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            prop="corporateIdentityCard"
          >
            <j-upload v-model="model.corporateIdentityCard"></j-upload>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item label="商标注册证" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="tradeMarkLicense">
            <j-upload v-model="model.tradeMarkLicense"></j-upload>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item label="联系电话" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contactNumber">
            <a-input v-model="model.contactNumber" placeholder="请输入联系电话"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item
            label="税务登记证"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            prop="taxRegistrationCertificate"
          >
            <j-upload v-model="model.taxRegistrationCertificate"></j-upload>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item label="企业联系人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="corporateContacts">
            <a-input v-model="model.corporateContacts" placeholder="请输入企业联系人"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="corporateName">
            <a-input v-model="model.corporateName" placeholder="请输入企业名称"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item
            label="企业地址(经纬度)"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            prop="corporateAddress"
          >
            <a-input v-model="model.corporateAddress" placeholder="请输入企业地址(经纬度)" :disabled="true"></a-input>
            <a-button type="primary" @click="visible = true"> 地图选点 </a-button>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
        <a-button type="primary" @click="applyFiling"> 申请备案 </a-button>

        <a-button style="margin-left: 20px" type="primary" @click="saveFiling"> 保存备案 </a-button>
      </a-form-model-item>
    </a-form-model>
    <div v-if="!enterpriseStatus">已经完成备案</div>
    <Reconnaissance :visible="visible" @close="reVisibleClose" @ok="addressInfo"></Reconnaissance>
  </div>
</template>

<script>
import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'
import { postAction } from '../../api/manage'
import Reconnaissance from '@/components/Reconnaissance.vue'
export default {
  name: 'ZzzsRecordEnterpriseForm',
  components: { Reconnaissance },
  props: {},
  data() {
    return {
      model: {},
      visible: false,
      enterpriseStatus: true,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      confirmLoading: false,
      validatorRules: {
        businessLicense: [{ required: true, message: '请输入营业执照!' }],
        organizationCodeCertificate: [{ required: true, message: '请输入组织机构代码证!' }],
        corporateIdentityCard: [{ required: true, message: '请输入法人身份证!' }],
        tradeMarkLicense: [{ required: true, message: '请输入商标注册证!' }],
        contactNumber: [
          { required: true, message: '请输入联系电话!' },
          { pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号码!' },
        ],
        taxRegistrationCertificate: [{ required: true, message: '请输入税务登记证!' }],
        corporateContacts: [{ required: true, message: '请输入企业联系人!' }],
        corporateName: [{ required: true, message: '请输入企业名称!' }],
        corporateAddress: [{ required: true, message: '请输入企业地址(经纬度)!' }],
      },
      url: {
        add: '/modules/zzzsRecordEnterprise/add',
        getStatusUrl: '/modules/zzzsRecordEnterprise/getEnterpriseStatus',
        edit: '/modules/zzzsRecordEnterprise/edit',
        saveFilingUrl: '/modules/zzzsRecordEnterprise/saveFiling',
        queryById: '/modules/zzzsRecordEnterprise/queryById',
      },
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
  },
  created() {
    this.getEnterpriseStatus()
  },
  methods: {
    addressInfo(addressInfo) {
      console.log(addressInfo)
      this.model.corporateAddress = addressInfo.longitude + ',' + addressInfo.latitude
      this.reVisibleClose()
    },
    //保存备案信息
    saveFiling() {
      postAction(this.url.saveFilingUrl, this.model).then((res) => {
        this.$message.success('保存备案信息成功')
      })
    },
    reVisibleOpen() {
      console.log(11111)
      this.reVisibleClose = true
      console.log(this.reVisibleClose)
    },
    reVisibleClose() {
      console.log(1111)
      this.visible = false
    },
    //申请备案方法
    applyFiling() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          postAction(this.url.add, this.model).then((res) => {
            this.getEnterpriseStatus()
          })
        }
      })
    },
    //获取企业的备案状态
    getEnterpriseStatus() {
      getAction(this.url.getStatusUrl).then((res) => {
        console.log(res)
        this.enterpriseStatus = res.result.status
        if (res.result.recordEnterprise) {
          this.model = res.result.recordEnterprise
        }
      })
    },
  },
}
</script>